import { ref, computed, watch } from 'vue'
import { widthDataIndex } from '../type'
import type { IColumnType } from '../type'
interface ColumnType extends IColumnType {
  disabled?: boolean;
}

export default function useFilter (columns: IColumnType[]) {
  const cloneColumns = ref<ColumnType[]>(columns)

  const checkboxGroup = ref<string[]>(columns.map(({ dataIndex }: IColumnType) => widthDataIndex(dataIndex)))
  const filterCheckboxColumns = computed<IColumnType[]>(() => {
    return cloneColumns.value.filter(({ dataIndex }: IColumnType) => checkboxGroup.value.includes(widthDataIndex(dataIndex)))
  })

  // 最少一项
  watch(checkboxGroup, (value) => {
    if (value.length === 1) {
      const setDisabled = cloneColumns.value.find(({ dataIndex }) => dataIndex === value[0])
      setDisabled && (setDisabled.disabled = true)
      return
    }
    cloneColumns.value.forEach((item) => { item.disabled = false })
  })

  return {
    cloneColumns,
    checkboxGroup,
    filterCheckboxColumns
  }
}
